<template>
  <van-skeleton title avatar :row="50" :loading="loading">
    <view class="page">
      <view class="home-bg">
        <view class="avatar-box">
          <view class="head-img">
            <image src="@/static/imgs/home_head.png"></image>
          </view>
          <view class="user-info">
            <view class="user-name">{{ userInfo.userName }}</view>
            <view class="user-org">{{ userInfo.deptName }}</view>
          </view>
        </view>
        <view class="scroll-view-box">
          <van-swipe :loop="false" indicator-color="#fff">
            <van-swipe-item>
              <view class="scroll-view-item_H" @click="onTabClick('jjzygw')">
                <text class="msg-count">{{ todoTab0 }}</text>
                <text class="msg-title">紧急重要</text>
              </view>
              <view class="scroll-view-item_H" @click="onTabClick('xsbw')">
                <text class="msg-count">{{ todoTab1 }}</text>
                <text class="msg-title">限时办文</text>
              </view>
              <view class="scroll-view-item_H" @click="onTabClick('dsqgw')">
                <text class="msg-count">{{ todoTab2 }}</text>
                <text class="msg-title">待审签</text>
              </view>
              <view class="scroll-view-item_H" @click="onTabClick('dybgw')">
                <text class="msg-count">{{ todoTab3 }}</text>
                <text class="msg-title">待阅办</text>
              </view>
            </van-swipe-item>
            <van-swipe-item>
              <view class="scroll-view-item_H" @click="onTabClick('dclsw')">
                <text class="msg-count">{{ todoTab4 }}</text>
                <text class="msg-title">待处理收文</text>
              </view>
              <view class="scroll-view-item_H" @click="onTabClick('swbl')">
                <text class="msg-count">{{ todoTab7 }}</text>
                <text class="msg-title">收文办理</text>
              </view>
              <!-- <view class="scroll-view-item_H" @click="onTabClick('dhsw')">
                <text class="msg-count">{{todoTab5}}</text>
                <text class="msg-title">待核收文</text>
              </view> -->
              <view class="scroll-view-item_H" @click="onTabClick('dsld')">
                <text class="msg-count">{{ todoTab6 }}</text>
                <text class="msg-title">待收来电</text>
              </view>
            </van-swipe-item>
          </van-swipe>
        </view>
      </view>
      <view class="u-padding-bottom-xs">
        <van-notice-bar v-if="noticeList != null && noticeList.length > 0" left-icon="volume-o"
                        :scrollable="false" background="#ffffff" color="#2979ff" mode="link">
          <van-swipe vertical class="notice-swipe"
                     :autoplay="3000" :show-indicators="false">
            <van-swipe-item v-for="(item,index) in noticeList" @click="noticeDetail(item)">
              <template #default>
                <van-tag v-if="item.tgType == '2'" mark type="danger">紧急</van-tag>
                <span>{{ item.title }}</span>
              </template>
            </van-swipe-item>
          </van-swipe>
          <template #right-icon>
            <van-icon name="arrow" @click="noticeMore"/>
          </template>
        </van-notice-bar>

        <view class="item-box">
          <view class="right-top-icon" @click="editIcon">
            <image src="/static/imgs/right-top-icon.png"></image>
          </view>
          <view class="right-top-uicon" @click="editIcon">
            <u-icon name="edit-pen-fill" color="#FFFFFF" size="30"></u-icon>
          </view>

          <van-grid :border="false" :column-num="4" class="ugrid">
            <van-grid-item v-for="(item,index) in arrList" :key="item.id" @click='onClick(item.id)'>
              <van-icon :name="item.name" size="24" :color="item.color"/>
              <view class="grid-text">{{ item.title }}</view>
            </van-grid-item>
          </van-grid>
        </view>
      </view>
      <view class="padding-top-xs">
        <docs ref="docList"></docs>
        <van-cell title="" is-link @click="toMore('doc')" value="更多" value-class="text-sm"/>
      </view>
      <view class="padding-top-xs">
        <news ref="newsList"></news>
        <van-cell title="" is-link @click="toMore('news')" value="更多" value-class="text-sm"/>
      </view>
      <van-divider :style="{ color: '#969799', borderColor: '#d3d0d5', padding: '0 16px' }">没有更多内容了</van-divider>
    </view>
  </van-skeleton>
</template>
<script>
import news from 'pages/jgj/components/newsList/compo-news.vue';
import docs from 'pages/jgj/components/newsList/compo-docs.vue';

export default {
  components: {
    news,
    docs
  },
  data() {

    return {
      userInfo: {},//当前登录用户信息，目前先从缓存中获取
      todoTab0: 0,//紧急重要
      todoTab1: 0,//限时办文
      todoTab2: 0,//待审签
      todoTab3: 0,//待阅办
      todoTab4: 0,//待处理收文
      todoTab5: 0,//待核收文
      todoTab6: 0,//待收来电
      todoTab7: 0,//收文办理
      page: 1,
      rows: 1,
      loading: true,
      //通知公告滚动数据
      noticeList: [],
      arrList: [{
        id: 1,
        name: 'todo-list-o',
        title: '待办',
        color: '#5998ff'
      },
        {
          id: 2,
          name: 'eye-o',
          title: '跟踪',
          color: '#ffbb5a'
        },
        {
          id: 3,
          name: 'search',
          title: '查询',
          color: '#5ae5ef'
        },
        {
          id: 4,
          name: 'star-o',
          title: '收藏',
          color: '#ffaca0'
        },
        {
          id: 5,
          name: 'orders-o',
          title: '新闻',
          color: '#d48dff'
        },

      ],
    }
  },
  onLoad: function (option) {

  },
  async mounted() {
    await this.$onLaunched //解決bug：执行完onLaunch后再执行页面onLoad
    this.userInfo = this.cache.get('userInfo')//从缓存获取用户信息userInfo: {"systemKey":"ls_liu","systemFlag":"yidong"}
    this.loading = false;
    this.getCaacMytodoWorks(0)  // 0紧急重要
    this.getCaacMytodoWorks(1)  // 1限时办文
    this.getCaacMytodoWorks(2)  // 2待审签
    this.getCaacMytodoWorks(3)  // 3待阅办
    this.getSwListData()    // 获取待处理收文待办数量
    this.queryGwhgList()    // 获取待核收文待办数量
    this.pengdinglist()     // 待收来电数量
    this.getSwblListData()  // 收文办理-待办
    this.getNoticeList()    // 获取通知公告
  },
  methods: {
    //tab左右滑动监听
    scroll(event) {
      //console.log(event)
    },
    onClick(id) {
      //直接跳转带参数
      if (id == 0) {
        this.$router.push({
          path: '/pages/jgj/column/column',
          query: {
            setid: id
          }
        });
      } else if (id == 1) {//待办
        uni.navigateTo({
          url: "/pages/jgj/send/signList"
        })
      } else if (id == 2) {//跟踪
        uni.navigateTo({
          url: "/pages/jgj/index/trace"
        })
      } else if (id == 3) {//查询
        uni.navigateTo({
          url: "/pages/jgj/index/search"
        })
      } else if (id == 4) {//收藏
        uni.navigateTo({
          url: "/pages/jgj/index/collection"
        })
      } else if (id == 5) {//新闻
        uni.navigateTo({
          url: '/pages/jgj/components/newsList/compo-index?activeName=' + 'zywj'
        })
      }
    },

    editIcon() {
      this.$router.push({
        path: '/pages/jgj/column/column',
        query: {
          setid: 0
        }
      });
    },

    onTabClick(tabIndex) {
      //tabIndex jjzzyw-紧急重要公文，xsbw-限时办文，dsqgw-待审签公文，dybgw-待阅办公文,dsld-待收来电
      if (tabIndex == 'dclsw') {
        uni.navigateTo({
          url: '/pages/jgj/receive/todoDoc'
        })
      } else if (tabIndex == 'swbl') {
        uni.navigateTo({
          url: '/pages/jgj/receive/doList'
        })
      }
      /* else if(tabIndex == 'dhsw'){
        // this.$toast('待核收文')
        uni.navigateTo({
          url:'/pages/jgj/receive/uncheckDoc'
        })
      } */
      else if (tabIndex == 'dsld') {
        //待收来电
        uni.navigateTo({
          url: '/pages/jgj/receiveMsg/receive-call'
        })
      } else {
        uni.navigateTo({
          url: "/pages/jgj/send/signList?topShow=" + tabIndex
        })
      }
    },
    //1.获取待办汇总接口todoTab 必传 类型 0紧急重要  1限时办文  2待审签   3待阅办
    getCaacMytodoWorks(todoTab) {
      var _this = this
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/mywork/MytodoWorks`),
        method: 'get',
        params: this.$http.adornParams({
          'todoTab': todoTab,
          'page': this.page,
          'rows': this.rows,
          'systemKey': this.userInfo.systemKey,//固定值
          'systemFlag': this.userInfo.systemFlag,//固定值
        })
      }).then(({data}) => {
        // console.log(data)
        if (data.code == 200) {
          if (todoTab == 0) {//紧急重要
            _this.todoTab0 = data.data.total
          } else if (todoTab == 1) {//限时办文
            _this.todoTab1 = data.data.total
          } else if (todoTab == 2) {//待审签
            _this.todoTab2 = data.data.total
          } else if (todoTab == 3) {//待阅办
            _this.todoTab3 = data.data.total
          }
        }
      })
    },

    //待处理收文
    getSwListData() {
      var _this = this
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/doc/fwend/getSwListData`),
        method: 'get',
        params: this.$http.adornParams({
          'ACCEPT_TYPE': 'IS NULL',
          'ACCEPT_DEPT': this.cache.get('userInfo').mainDept.deptCode,
          'page': this.page,
          'rows': this.rows,
          'systemKey': this.userInfo.systemKey,//固定值
          'systemFlag': this.userInfo.systemFlag,//固定值
        })
      }).then(({data}) => {

        if (data.code == 200) {
          _this.todoTab4 = data.data.total
        }
      })
    },
    // 收文办理-待办
    getSwblListData() {
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/doc/swbanli/swbanlilist`),
        method: 'post',
        params: this.$http.adornParams({
          'systemKey': this.cache.get('userInfo').systemKey,
          'systemFlag': this.cache.get('userInfo').systemFlag,
          'page': this.page,
          'rows': this.rows,
          'isJldps': '1',
          'swWord': ""
        })
      }).then(({data}) => {
        if (data.code == 200) {
          this.todoTab7 = data.data.total
        }
      })

    },

    //获取待核收文待办数量
    queryGwhgList() {
      var _this = this
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/doc/gwhgList/queryGwhgList`),
        method: 'get',
        params: this.$http.adornParams({
          'gwhgStatus': 1,
          'page': this.page,
          'rows': this.rows,
          'systemKey': this.userInfo.systemKey,//固定值
          'systemFlag': this.userInfo.systemFlag,//固定值
        })
      }).then(({data}) => {
        if (data.code == 200) {
          _this.todoTab5 = data.data.total
        }
      })
    },

    //获取待收来电数量
    pengdinglist() {
      var _this = this
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/doc/hbjgj/fdpengding/pengdinglist`),
        method: 'get',
        params: this.$http.adornParams({
          'acceptType': 1,
          'page': this.page,
          'rows': this.rows,
          'systemKey': this.userInfo.systemKey,//固定值
          'systemFlag': this.userInfo.systemFlag,//固定值
        })
      }).then(({data}) => {
        // console.log(data)
        if (data.code == 200) {
          _this.todoTab6 = data.data.total
        }
      })
    },

    // 获取通知公告
    getNoticeList() {
      let _this = this
      _this.$http({
        url: _this.$http.adornUrl(`/caac/oa/annunciate/findAnnunciateListByUserId`),
        method: 'get',
        params: _this.$http.adornParams({
          'systemKey': this.userInfo.systemKey,
          'systemFlag': this.userInfo.systemFlag,
          'userId': this.userInfo.userId
        })
      }).then(({data}) => {
        if (data.code == 200) {
          _this.noticeList = data.data
        }
      })
    },
    // 点击通知消息跳转详情
    noticeDetail(item) {
      uni.navigateTo({
        url: '/pages/jgj/components/newsList/compo-detail?from=notice',
        success: function (res) {
          // 通过eventChannel向被打开页面传送数据
          res.eventChannel.emit('acceptDataFromOpenerPage', item)
        }
      })
    },
    noticeMore() {
      uni.navigateTo({
        url: '/pages/jgj/components/newsList/compo-notice'
      })
    },

    // 更多
    toMore(type) {
      let activeName = ''
      if (type == 'doc') {
        activeName = this.$refs.docList.activeName
      } else {
        activeName = this.$refs.newsList.activeName
      }
      uni.navigateTo({
        url: '/pages/jgj/components/newsList/compo-index?activeName=' + activeName
      })
    }
  },

}
</script>

<style scoped>
	/* 最上边背景图片 */
	.home-bg {
		width: 100%;
		height: 350rpx;
		border-top-left-radius: 25rpx;
		border-top-right-radius: 25rpx;
    background: url(../../../static/imgs/home-bg.png) repeat bottom center;
	}

  /* 头像信息区 */
  .avatar-box {
    display: flex;
    flex-direction: row;
    width: auto;
    height: 50%;
    align-items: center;
    padding-left: 80rpx;
    padding-top: 50rpx;;
  }

  .avatar-box image {
    height: 110rpx;
    width: 110rpx;
    border-radius: 20%;
  }

  .avatar-box .user-info {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-left: 28rpx;
    height: 90rpx;
    width: 300rpx;
  }

  .user-info .user-name {
    line-height: 40rpx;
    font-size: 38rpx;
    font-weight: 800rpx;
    color: #FFFFFF;
  }

  .user-info .user-org {
    font-size: 24rpx;
    color: #FFFFFF;
    padding-bottom: 10rpx;
  }

	.scroll-view-box {
		/*display: flex;
		flex-direction: row;*/
    width: 100%;
		align-items: center;
    margin-top: 36rpx;
	}

	/* 滑动区域 */
	.scroll-view_H {
		/* 文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。 */
		flex-direction: row;
		white-space: nowrap;
		width: 100%;
		height: 190rpx;

	}

	.scroll-view-item_H {
		display: inline-flex;
		flex-direction: column;
		justify-content: flex-end;
		align-items: flex-end;
		width: 25%;
		height: 100%;
	}

	.scroll-view-item_H .msg-count {
		margin-bottom: 15rpx;
		width: 100%;
		font-size: 28rpx;
		font-weight: bold;
		text-align: center;
		color: #FFFFFF;
	}

	.scroll-view-item_H .msg-title {
		margin-bottom: 55rpx;
		width: 100%;
		font-size: 28rpx;
		text-align: center;
		color: #FFFFFF;
	}

	.ugrid {
		margin-top: 30rpx;
		padding: 0 0px;
    background-color: #FFFFFF;
    width: 100%;
	}

	.grid-text {
		font-size: 28rpx;
		margin-top: 4rpx;
		color: $u-type-info;
	}

  /* 右上角角标开始 */
  .item-box{
    position: relative;
    display: flex;
    flex-direction: row;
    background-color: #FFFFFF;
    border-radius: 20rpx;
    align-items: center;
    box-shadow: 2rpx 4rpx 10rpx #d8d8d8;
    margin-top: 10rpx;
  }

  .right-top-icon{
    position: absolute;
    top: 0;
    right: 0;
    width: 72rpx;
    height: 76rpx;
    z-index: 10;
  }
  .right-top-icon image{
    display: inline;
  }
  .right-top-uicon{
    position: absolute;
    top: 6rpx;
    right: 0rpx;
    width: 40rpx;
    height: 40rpx;
    z-index: 20;
  }
  .right-top-uicon u-icon{
    display: inline;
    width: 100%;
    height: 100%;
  }
  /* 右上角角标结束 */

  /deep/.van-grid-item__content {
    padding: 8px 8px;
  }

  .notice-swipe {
    height: 40px;
    line-height: 40px;
  }
</style>
